{% extends "base.html" %}
{% load  mytags %}
{% load   guardian_tags %}


{% block header-css %}
<link href="/static/webssh_static/css/xterm.min.css" rel="stylesheet" type="text/css"/>
<link href="/static/webssh_static/css/fullscreen.min.css" rel="stylesheet" type="text/css"/>
{% endblock %}


{% block  title %}资产信息{% endblock %}







{% block page-content %}
<div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-lg-10">
            <h2>资产信息</h2>
            <ol class="breadcrumb">
                <li>
                    <a href="/index.html">主页</a>
                </li>
                <li>
                    <a>资产管理</a>
                </li>
                <li class="active">
                    <strong>资产信息</strong>
                </li>
            </ol>
        </div>
        <div class="col-lg-2">

        </div>
    </div>
<div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>资产信息</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#">选项 1</a>
                                </li>
                                <li><a href="#">选项 2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">

                        <div class="table-responsive">


                            <form id="cha" class="form-horizontal" action="{% url 'asset:asset_list' %}" method="post">
                                {% csrf_token %}
                                <div class="col-md-2"><input type="text" class="form-control" name="name" required>
                                </div>

                                <button class="btn btn-primary" type="submit">查询</button>


                                <a href="{% url    'asset:asset_add' %}" class="btn btn-primary  ">
                                    添加</a>


                                <a class="btn btn-danger  asset_all_del"
                                >批量删除
                                </a>
                                <a href="{% url    'asset:asset_export' %}" class="btn btn-primary  ">
                                    导出全部</a>
                            </form>


                            <form id="del_form_asset_all" class="form-horizontal  ">
                                <table class="table table-striped table-bordered table-hover dataTables-example">
                                    <thead>
                                    <tr>
                                        <th width="20"><input type="checkbox" id="CheckedAll"></th>
                                        <th>外网IP</th>
                                        <th>管理IP</th>
                                        <th>产品线</th>
                                        <th>位置</th>
                                        <th>型号</th>
                                        <th>SN</th>
                                        <th>动作{{ error_performance }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>

                                    {% for   row   in   asset_list %}

                                        <tr class="gradeA" id="{{ row.id }}">
                                            <td><input type="checkbox" value="{{ row.id }}" name="id"></td>
                                            <td class="center"><a
                                                    href="{% url  "asset:asset_detail"   pk=row.id %}">{{ row.network_ip }}</a>
                                            </td>
                                            <td class="center">{{ row.manage_ip }}</td>
                                            <td class="center">{{ row.product_line.name }}</td>
                                            <td class="center">{{ row.cabinet }} {{ row.position }}</td>
                                            <td class="center">{{ row.model }}</td>
                                            <td class="center">{{ row.sn }}</td>
                                            <td><a class="btn btn-primary  btn-xs "
                                                   href="{% url  "asset:asset_update"  pk=row.id %}">编辑</a>
                                                <a class="btn btn-danger  btn-xs  asset_del" data-toggle="modal"
                                                   data-target="#myModal1">删除
                                                </a>
                                                <a class="btn btn-primary  btn-xs "
                                                   href="{% url    "asset:asset_performance"   row.id %}">性能</a>
                                                <a type="button" class="btn btn-primary btn-xs webssh" >终端
                                                </a>


                                            </td>
                                        </tr>
                                    {% endfor %}

                                    </tbody>

                                </table>
                            </form>


                        </div>

                    </div>


                </div>
            </div>
        </div>
    </div>



{% block footer-js %}

<script src="/static/webssh_static/js/xterm.min.js"></script>
<script src="/static/webssh_static/js/fullscreen.min.js"></script>


<script>
     $(function () {

       $('.asset_del').click(function () {

              $.ajaxSetup({headers: {"X-CSRFToken": '{{ csrf_token }}'}});
                    var id = $(this).parent().parent().attr('id');

                    swal({
                        title: "你确定删除",
                        text: "你将无法恢复",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "确定",
                        closeOnConfirm: false
                    }, function () {

                        $.ajax({
                            url: "/asset/asset-del.html",
                            type: 'POST',
                            data: {'nid': id},
                            success: function (data) {
                                var obj = JSON.parse(data);
                                if (obj.status) {
                                    swal({title: "删除", text: "已成功删除", type: "success"}, function () {
                                        window.location.reload();
                                    })
                                } else {
                                    swal("错误", "删除" + "[ " + obj.error + " ]" + "遇到错误", "error");
                                }
                            }
                        });


                    });

                });


       $('.asset_all_del').click(function () {
                   $.ajaxSetup({headers: {"X-CSRFToken": '{{ csrf_token }}'}});

                    swal({

                        title: "你确定删除",
                        text: "你将无法恢复",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "确定",

                        closeOnConfirm: false
                    }, function () {
                        $.ajax({
                            url: "/asset/asset-all-del.html",
                            type: 'POST',
                            data: $('#del_form_asset_all').serialize(),
                            success: function (data) {
                                var obj = JSON.parse(data);
                                if (obj.status) {
                                    swal({title: "删除", text: "已成功删除", type: "success"}, function () {
                                        window.location.reload();
                                    })
                                } else {
                                    swal("错误", "删除" + "[ " + obj.error + " ]" + "遇到错误", "error");
                                }
                            }
                        });


                    });
                });


            });


            jQuery(function ($) {


                $('.webssh').click(function (event) {
                    event.preventDefault();

                    var id_a = $(this).parent().parent().attr('id');

                    $.ajax({
                        headers: {"X-CSRFToken": '{{ csrf_token }}'},
                        url: "/asset/asset-webssh.html",
                        type: 'POST',
                        data: {'id': id_a},
                        success: function (ret) {

                            var obj = JSON.parse(ret);
                            var ips = obj.ip;
                            var ports = obj.port;
                            var usernames = obj.username;
                            var passwords = obj.password;

                            $.ajax({
                                url: "http://{{ Webssh }}:{{ Webssh_port }}/",
                                type: 'POST',
                                data: {hostname: ips, port: ports, username: usernames, password: passwords},
                                crossDomain: true,
                                success: callback
                            });

                            function callback(msg) {
                                console.log(msg);
                                if (msg.status) {
                                      swal("错误", "删除" + "[ " + msg.status + " ]" + "遇到错误", "error");
                                      return;
                                }

                                var    url = "ws://{{ Webssh }}:{{ Webssh_port }}/" + 'ws?id=' + msg.id,
                                    socket = new WebSocket(url),
                                    terminal = document.getElementById('#terminal'),
                                    term = new Terminal({cursorBlink: true});

                                console.log(url);
                                term.on('data', function (data) {
                                    // console.log(data);
                                    socket.send(data);
                                });

                                socket.onopen = function (e) {
                                    $('.container1').hide();
                                    term.open(terminal, true);
                                    term.toggleFullscreen(true);
                                };

                                socket.onmessage = function (msg) {
                                    console.log(msg);
                                    term.write(msg.data);
                                };

                                socket.onerror = function (e) {
                                    console.log(e);
                                };

                                socket.onclose = function (e) {
                                    console.log(e);
                                    term.destroy();
                                    $('.container1').show();
                                    // status.text(e.reason);
                                };
                            }

                        }
                    });
                });
            });

        </script>


    {% endblock %}

{% endblock %}